<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title>宝贝详情</title>
	<meta name="keywords" content="堇云定制" />
	<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui">
	<meta name="apple-mobile-web-app-title" content="堇云定制" />
	<meta content="telephone=no" name="format-detection" />
	<meta name="apple-mobile-web-app-capable" content="yes" />
  <link rel="stylesheet" href="../res/css/main.css">
</head>
    
<body>
     <!--Star header-->
     <div id="header">
          <!--Star top-->
          <div class="t">
               <div class="wraper">
                    <a href="#"><i class="g-icon-fav"></i>收藏我们</a>
                    <span class="fr">
                          <a href="#" class="mr60"><i class="g-icon-map"></i>找到我们</a>
                          <a href="#" class="mr60"><i class="g-icon-contact"></i>联系我们</a>
                          <a href="#"><i class="g-icon-about"></i>关于我们</a>
                    </span>
               </div>
          </div>

          <!--Star logo-->
          <div class="wraper m tc"><a href="#" class="g-icon-logo"></a></div>

          <!--Star nav-->
          <div class="wraper">
               <ul class="nav clearfix">
                   <!--Star tel-->
                   <span class="fr fn12"><i class="g-icon-tel"></i>&nbsp;400－821－8870</span>
                   <li class="g-drop curren">
                       <span class="drop-focus"><i class="g-icon-buy"></i>购买<em class="g-icon-arrow ml5"></em></span>
                       <!--Star 下拉Box-->
                       <div class="drop-bd">
                            <i class="g-icon-gray-arrow"></i>
                            <div class="qr-item">
                                  <div class="qr-bd">
                                       <img src="../res/img/qr-code.png" class="fr" alt="">
                                       <p class="qr-txt"><i class="g-icon-weixin"></i><br>去微店购买</p>
                                  </div>
                            </div>

                            <div class="qr-item">
                                  <div class="qr-bd">
                                       <img src="../res/img/qr-code.png" class="fr" alt="">
                                       <p class="qr-txt"><i class="g-icon-taobao"></i><br>手机淘宝购买</p>
                                  </div>
                            </div>
                       </div>
                   </li>
                   <li class="current"><a href="#"><i class="g-icon-cat"></i>喵主子</a></li>
                   <li><a href="#"><i class="g-icon-ps"></i>潮流配饰</a></li>
                   <li class="g-drop">
                       <span class="drop-focus"><i class="g-icon-dz"></i>高级定制<em class="g-icon-arrow ml5"></em></span>
                       <!--Star 下拉Box-->
                       <div class="drop-bd">
                            <i class="g-icon-gray-arrow"></i>
                            <p class="drop-list">
                               <a href="#">钻石</a>
                               <a href="#"><a href="#">祖母绿</a>
                               <a href="#">蓝宝</a>
                               <a href="#">金绿石</a>
                            </p>
                       </div>
                   </li>
                   <li><a href="#"><i class="g-icon-live"></i>生活志</a></li>
               </ul>
          </div>
     </div>
     <!--End header-->

     <!--Star wraper-->
     <div class="wraper">
          
          <!--Star 宝贝详情-->
          <div class="detail-mod overflow">
               <!--Star Left-->
               <div class="d-left fl">
                    <!--Star slider-->
                    <div class="d-slider">
                         <div class="d-bd">
                               <ul>
                                    <li><a href="#"><img src="../res/img/jy-index-product01.jpg" alt="" /></a></li>
                                    <li><a href="#"><img src="../res/img/jy-index-product03.jpg" alt="" /></a></li>
                                    <li><a href="#"><img src="../res/img/jy-index-product02.jpg" alt="" /></a></li>
                               </ul>
                         </div>
                         <div class="d-slider-nav">
                              <a href="###"><img src="../res/img/jy-index-product01.jpg" alt="" /></a>
                              <a href="###"><img src="../res/img/jy-index-product03.jpg" alt="" /></a>
                              <a href="###"><img src="../res/img/jy-index-product02.jpg" alt="" /></a>
                         </div>
                    </div>

                    <!--Star 其他宝贝推荐-->
                    <div class="d-recommend">
                         <h2><span class="title">其他宝贝推荐</span></h2>
                         <div class="rec-i"><a href="###"><img src="../res/img/jy-index-product01.jpg" alt=""></a><a href="###"><img src="../res/img/jy-index-product01.jpg" alt=""></a><a href="###"><img src="../res/img/jy-index-product01.jpg" alt=""></a></div>
                    </div>
               </div>

               <!--Star Right-->
               <div class="d-right fl">
                    <h2>猫系列金饰</h2>
                    <h3>TYPE TYPE</h3>
                    <h3>AVDNSNF  FDSK F EJF SLF JSDL</h3>
                    <dl class="d-info" id="d-drop">
                        <dt><span class="d-color">+</span>宝贝详情：</dt>
                        <dd>全手工打磨制作，18K素金，高z工艺个性弧度，可搭配成颈链和手链，<br>适用日常通勤 ，出游，酒会等。<br>
吊坠灵感来源于我家萌神喵星人总管，吊坠长X宽X厚：<br>10.81mm*20.34mm*2.02mm（厚度是指弧度最厚处），<br>约重2克</dd>
                        <dt><span class="d-color">+</span>工艺：</dt>
                        <dd>纯手工打磨制作，18K素金，高工艺个性弧度，可搭配成颈链和手链。</dd>
                        <dt><span class="d-color">+</span>可定制</dt>
                        <dd>纯手工打磨制作，18K素金，高工艺个性弧度，可搭配成颈链和手链。</dd>
                        <dt><span class="d-color">+</span>保养</dt>
                        <dd>纯手工打磨制作，18K素金，高工艺个性弧度，可搭配成颈链和手链。</dd>
                    </dl>
               </div>
          </div>
          
     </div>
     <!--End wraper-->
     

     <!--Star Footer-->
     <div id="footer">
           <!--Star top-->
           <div class="wraper ft-t pr">
                <i class="g-icon-jinacc"></i>
                <div class="email-reg">
                     <p><i class="g-icon-email"></i>您将会在第一时间收到，有关我们新品、特殊活动、新店开张等信息</p>
                     <div class="mt20"><input type="text" class="email-txt" placeholder="Enter your e-mail address"><button class="btn-reg ml15">注册</button></div>
                </div>
                <img src="../res/img/qr-attention.png" alt="" class="qr-attention">
           </div>

           <!--Star copyright-->
           <div class="ft-b">
                <div class="wraper pr">
                     <p class="blank">© Copyright 2014 FreebiesXpress.com<a href="#">公司介绍</a><a href="#">定制流程</a><a href="#">网站政策</a></p>
                     <i class="g-icon-goup"></i>
                     <div class="share-icon"><a href="#"><i class="share-icon-weixin"></i></a><a href="#"><i class="share-icon-weibo"></i></a><a href="#"><i class="share-icon-taobao"></i></a><a href="#"><i class="share-icon-douban"></i></a></div>
                 </div>
           </div>
     </div>
    

     <script type="text/javascript" src="../res/js/jquery-1.8.3.min.js" ></script>
     <script type="text/javascript" src="../res/js/ui.base.js" ></script>
     <script type="text/javascript" src="../res/js/ui.Xslider.js" ></script>

     <script>
        $(function(){
            UI.Xslider(".d-slider",{
              autoScroll:5000,
              dir: "V",
              speed:3000,
              scrollObj:".d-bd ul",
              showNav:".d-slider-nav a"
            });

            $("#d-drop dt").toggle(function(){
                $(this).next("dd").slideDown();
                $(this).find(".d-color").text("-")
            },function(){
                $(this).next("dd").slideUp();
                $(this).find(".d-color").text("+")
                
            })
        });

     </script>

</body>
</html>